// 入口函数
$(function () {
  // 1. 绑定事件，点击切换登录/注册页面
  $('#loginBox a').on('click', function () {
    //   1.1 点击登录中的a，登录区域隐藏，注册区域显示
    $('#loginBox').hide()
    $('#regBox').show()
  })

  $('#regBox a').on('click', function () {
    //   1.2 点击注册中的a，注册区域隐藏，登录区域显示
    $('#regBox').hide()
    $('#loginBox').show()
  })

  // 2. 表单校验
  //   console.log(layui)
  let form = layui.form
  form.verify({
    username: [/^[\S]{6,12}$/, '用户名必须6到12位，且不能出现空格'],
    pwd: [/^[\S]{6,12}$/, '密码必须6到12位，且不能出现空格'],
    regpwd: function (value) {
      // value 是哪个标签添加就是哪个标签的值

      // 获取密码表单的value值
      let pwd = $('#regBox input[name="password"]').val()

      // 如果密码表单的值和value值不相等，结束函数并提示
      if (pwd != value) {
        return '输入两次密码不一致'
      }
    }
  })

  // 3. 发起ajax

  // 3.1 注册区域发起ajax
  $('#regBox .layui-form').on('submit', function (e) {
    e.preventDefault()
    axios({
      method: 'post',
      url: '/api/reguser',
      data: $(this).serialize()
    }).then(({ data: res }) => {
      //成功回调
      // console.log(res)

      if (res.status != 0) {
        //   重置表单
        $('#regBox .layui-form')[0].reset()
        return layui.layer.msg(res.message)
      }

      //   提示注册成功
      layui.layer.msg('恭喜您,注册成功!')

      //   重置表单
      $('#regBox .layui-form')[0].reset()

      // 跳转登录
      $('#regBox a').click()
    })
  })

  // 3.2 登录区域发起ajax
  $('#loginBox .layui-form').on('submit', function (e) {
    e.preventDefault()
    axios({
      method: 'post',
      url: '/api/login',
      data: $(this).serialize()
    }).then(({ data: res }) => {
      //成功回调
      // console.log(res)

      if (res.status != 0) {
        return layui.layer.msg(res.message)
      }

      //   提示登录成功
      layui.layer.msg('恭喜您,登录成功!')

      // 跳转index页面
      setTimeout(function () {
        location.href = '/index.html'
      }, 1000)

      // 储存token身份验证至本地
      localStorage.setItem('token', res.token)
    })
  })
})
